.container {
    background: #FFFFFF;
}
.tc-blue {
    color: #54D0FF;
}
.tc-blue:hover {
    text-decoration: none;
    color: #54D0FF;
}
.tc-strong-blue {
    font-weight: bold;
    color: #54D0FF;
}
.tc-strong-blue:hover {
    text-decoration: none;
    font-weight: bold;
    color: #54D0FF;
}
.cursor-pointer {
    cursor: pointer;
}

#profile-settings {
    background: #FFF;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    min-height: 500px;
    border: 1px solid #C6D0D8;
}

#profile-settings .title h3 {
    font-weight: bold;
}

#advanced-settings-accordion .item-title {
    display: block;
    font-size: 24px;
    color: #354650;
    font-weight: bold;
    text-decoration: none;
    padding-right: 16px;
    position: relative;
}

#advanced-settings-accordion .item-number {
    color: #54cfff;
}

#advanced-settings-accordion .settings-form-note {
    color: #354650;
    background: #e6f8ff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#advanced-settings-accordion .settings-form-content {
    padding-top: 15px;
}

#advanced-settings-accordion .bg-app-light-gray, #profile-settings-form .bg-app-light-gray, #profile-new-settings-form .bg-app-light-gray {
    background-color: #F2F6FB;
}

#advanced-settings-accordion .form-control {
    line-height: 2.5rem;
}

#advanced-settings-accordion .check-box-field {
    background-color: #F2F6FB;
    border: 1px solid #c6d0d7;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#advanced-settings-accordion .custom-radio .custom-control-indicator {
    width: 1.75rem;
    height: 1.75rem;
    border: 1px solid #c7d1d8;
    background-color: #FFF;
}

#advanced-settings-accordion .custom-radio .custom-control-input:checked~.custom-control-indicator {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='4' fill='%2354cfff'/%3E%3C/svg%3E");
}

#advanced-settings-accordion .custom-radio .custom-control-input:checked~.custom-control-indicator {
    background-color: #FFF;
}

#advanced-settings-accordion .custom-control-description {
    font-size: 20px;
}

#advanced-settings-accordion .check-box-field .custom-control .form-control {
    background: #FFF;
}

#advanced-settings-accordion .custom-checkbox .custom-control-input:checked~.custom-control-indicator {
    background-color: #54cfff;
}

#advanced-settings-accordion .input-label, #profile-settings-form .input-label {
    font-weight: bold;
}

#advanced-settings-accordion .custom-checkbox .custom-control-indicator {
    width: 1.75rem;
    height: 1.75rem;
    background-color: #FFFFFF;
    border: 1px solid #c7d1d8;
}

#initUpload {
    cursor: pointer;
}

#advanced-settings-accordion .form-group p.input-text-note {
    font-size: 14px;
    color: #6E7B83;
    margin-bottom: 8px;
}

#advanced-settings-accordion .advanced-settings-submit-button, #profile-settings-form .advanced-settings-submit-button, #profile-new-settings-form .advanced-settings-submit-button {
    cursor: pointer;
    border-color: #55d0ff !important;
    background-color: #55d0ff !important;
}

#advanced-settings-accordion .advanced-settings-submit-button:disabled{
    border-color: #ecf2f6 !important;
    background-color: #ecf2f6 !important;
    color: #96a1a9;
}

#advanced-settings-accordion .fas {
    position: absolute;
    top: 8px;
    color: #97a1a9;
    font-size: 18px;
    right: 0;
}

#advanced-settings-accordion .fa-chevron-up {
    display: block;
}

#advanced-settings-accordion .fa-chevron-down {
    display: none;
}


#advanced-settings-accordion .collapsed .fa-chevron-down {
    display: block;
}

#advanced-settings-accordion .collapsed .fa-chevron-up {
    display: none;
}

#advanced-settings-open-button .setting {
    color: #54cfff;
    font-size: 20px;
    font-weight: bold;
}

#advanced-settings-open-button {
    cursor: pointer;
}

#profile-settings-form .form-control {
    font-size: 18px;
    line-height: 2.5rem;
}

#profile-settings-form .form-control:read-only {
    background: none;
    border: none;
    padding: 0;
}

#profile-settings {
    padding: 2rem;
}

#profile-settings hr {
    border-top: 2px solid rgba(0,0,0,.1);
}

#profile-settings .form-hr {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

#profile-settings-head h2 {
    font-weight: bold;
    padding: 1rem 0;
}

#profile-settings-head {
    margin-left: 0;
    margin-right: 0;
}

.rem-4 {
    line-height: 4.5rem;
    text-align: left;
}

@media (min-width: 992px) {
    .rem-4 {
        text-align: right;
    }

}

#profile-settings-head .stop-receiving-clients {
    font-size: 18px;
    text-transform: uppercase;
    vertical-align: middle;
    display: inline-block;
    color: #ff4764;
    cursor: pointer;
}

#profile-settings-head .stop-receiving-clients .fas {
    margin-right: 0.5rem;
}

#profile-settings-head .stop-receiving-clients:hover {
    color: #DA1735;
}

#profile-settings-head .stop-receiving-clients.green-receive {
    color: #29C581 !important; /*#2fc344;*/
}

#profile-settings-head .stop-receiving-clients.green-receive:hover{
    color: #15B36E !important;
}

#advanced-settings-accordion .advanced-settings-submit-button:hover,
#profile-settings-form .advanced-settings-submit-button:hover,
#profile-new-settings-form .advanced-settings-submit-button:hover {
    background-color: #00B9FF !important;
}

#advanced-settings-open-button:hover > p.setting {
    color: #00B9FF;
}

.alert button {
    cursor: pointer;
}

#profile-settings .input-time-box {
    position: relative;
}

#profile-settings .input-time-box span.am-pm{
    position: absolute;
    top: 12px;
    right: 55px;
    font-size: 18px;
    cursor: pointer;
}

#profile-settings .input-time-box span.input-time-am {
    right: 55px;
}

#profile-settings .input-time-box span.input-time-pm {
    right: 15px;
}

#profile-settings .input-time-box span.selected {
    color: #54D0FF;
}


/*Design conflict fix*/
i.mark {
    background: none;
}

.table {
    margin-bottom: 0;
}

/* Timepicker design conflict with bootstrap fix */
.ui-timepicker-table td a {
    box-sizing: unset;
}

.ui-state-disabled, .ui-widget-content .ui-state-disabled {
    /* width: 100%; */ /* bad fix for datepicker - look that http://prntscr.com/jfragc */
}

#content-form-bg {
    box-shadow: none !important;
}

#content {
    background: #FFFFFF;
}
/*
 custom header with effect
*/
#settings-header {
    height: 55px;
    border-bottom: 1px solid #C6D0D8;
    background: #FFF;
    position: relative;
    margin-bottom: 30px;
    display: block;
}
.header-entry {
    float: left;
    display: flex;
    vertical-align: middle;
    height: 100%;
    align-items: center;
    margin: 0 20px;
    color: #728B9B;
    font-size: 16px;
    line-height: 31px;
}
.header-entry:hover {
    text-decoration: none;
    color: #354650;
}
.header-entry:first-of-type {
    margin-left: 40px;
}
.header-entry.active {
    color: #354650;
    border-bottom: 3px solid #54D0FF;
}
.header-entry.active:hover {
    color: #354650;
    text-decoration: none;
}
.header-entry img {
    margin-right: 15px;
}
#header-blue-bar {
    width: 80px;
    left: 0;
    height: 4px;
    background-color: #54D0FF;
    position: absolute;
    bottom: 0;
    -webkit-transition: width 0.25s ease-in-out, left 0.25s ease-in-out;
    transition: width 0.25s ease-in-out, left 0.25s ease-in-out;
}
/*
 custom header with effect
*/
.billing-container {
    width: 100%;
    padding: 0 10px;
}
.billing-container h2 {
    line-height: 38px;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 20px;
}
.billing-table thead th {
    font-size: 14px;
    padding: 8px 15px;
    color: #728B9B;
    line-height: 14px;
    font-weight: normal;
    border: none;
}
.billing-table tr {
    height: 80px;
    vertical-align: middle;
}
.billing-table td, .billing-table th {
    vertical-align: middle;
    font-size: 16px;
    line-height: 19px;
    color: #354650;
}
.billing-table.empty td, .billing-table.empty th {
    width: 100%;
}
.billing-table thead {
    background-color: #F2F6FB;
    font-size: 14px;
}
.billing-table thead tr {
    height: unset;
}
.billing-table .status, .billing-mobile-entry .status {
    padding: 6px 14px;
    width: max-content;
    border-radius: 15px;
    font-size: 14px;
    height: 30px;
    line-height: 18px;
}
.billing-table .not-paid, .billing-mobile-entry .not-paid {
    border: 1px solid rgba(255,47,79,0.08);
    background-color: rgba(255,47,79,0.07);
    color: #FF2F4F;
}
.billing-table .paid, .billing-mobile-entry .paid {
    border: 1px solid rgba(41,197,129,0.1);
    background-color: rgba(41,197,129,0.08);
    color: #29C581;
}
.billing-table .refunded, .billing-mobile-entry .refunded {
    border: 1px solid rgba(41,197,129,0.1);
    background-color: rgba(41,197,129,0.08);
    color: #29C581;
}
.billing-table .btn-blue, .billing-mobile-entry .btn-blue {
    background-color: #54D0FF;
    border-radius: 6px;
    padding: 11px 0;
    width: 90px;
    line-height: 18px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
}
.billing-table .btn-blue:hover, .billing-mobile-entry .btn-blue:hover {
    background-color: #00aff1;
}
.billing-mobile-entry .btn-blue {
    width: 100%;
    margin-top: 10px;
}
.billing-table .other-menu {
    cursor: pointer;
}
.billing-table .td-refund {
    position: relative;
    width: 35px;
}
.billing-table .td-refund .other-menu {
    padding: 0 5px;
}
.billing-table .refund-menu {
    position: absolute;
    right: 27px;
    top: 11px;
    width: max-content;
    background-color: #FFFFFF;
    border-radius: 6px;
    padding: 16px 17px;
    border: 1px solid #E6ECF1;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,0.08);
    display: none;
    cursor: pointer;
}
.billing-table .refund-menu img {
    margin-right: 4px;
}
.billing-table .refund-menu.active {
    display: block;
}
.tc-custom-modal button.close {
    cursor: pointer;
    right: 20px;
    position: absolute;
    top: 10px;
    z-index: 2;
}
.tc-custom-modal button.close img {
    height: 10px;
    width: 10px;
}
.tc-custom-modal .img-container {
    margin-top: 30px;
    text-align: center;
}
.tc-custom-modal .modal-content {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.tc-custom-modal .modal-body {
    padding: 10px 30px;
}
.tc-custom-modal .description-header {
    margin-top: 25px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: #354650;
    line-height: 28px;
    margin-bottom: 13px;
}
.tc-custom-modal .description-text {
    text-align: center;
    line-height: 22px;
}
.tc-custom-modal .buttons-container {
    margin-top: 18px;
}
.tc-custom-modal .btn {
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
    line-height: 33px;
    text-transform: uppercase;
    letter-spacing: 0.1px;
    margin-bottom: 20px;
    cursor: pointer;
    padding: 8px;
}
.tc-custom-modal .btn-tc-blue {
    background-color: #54D0FF;
    color: #FFFFFF;
}
.tc-custom-modal .btn-tc-blue:hover {
    background-color: #00aff1;
}
.tc-custom-modal .btn-tc-light-blue {
    background-color: #F2FCFF;
    color: #54D0FF;
    border: 1px solid #BFEDFF;
}
.tc-custom-modal .btn-tc-light-blue:hover {
    background-color: #54D0FF;
    color: #FFFFFF;
}
.tc-custom-modal .strong-blue {
    font-weight: bold;
    color: #54D0FF;
}
.tc-custom-modal .btn-tc-red {
    background-color: #FF2F4F;
    color: #FFFFFF;
}
.tc-custom-modal .btn-tc-red:hover {
    background-color: #ac2238;
    color: #FFFFFF;
}
.tc-custom-modal .comment-container {
    margin-bottom: 10px;
}
.tc-custom-modal .comment-field {
    border: 1.5px solid #C6D0D8;
    border-radius: 6px;
    background-color: #F2F6FB;
    width: 100%;
    min-height: 120px;
    padding: 10px 15px;
}
#payThankYouModal .modal-dialog, #refundModal .modal-dialog {
    width: 340px;
    height: 320px;
}
#payModal .modal-dialog {
    width: 350px;
}
.no-data-table {
    background: #f3f3f3;
    text-align: center;
}
.tooltip-inner {
    background-color: #354650;    
    color: #ffffff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 15px;
    
}
.tooltip.show
{
    opacity: 1;
    margin-top: 11px;
    margin-bottom: 11px;
}
.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before, .tooltip.bs-tooltip-top .arrow::before {
    border-top-color: #354650;
    border-width: 16px 16px 0;
    margin-left: -15px;
    margin-bottom: -6px;
    bottom: 0;


}
.tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .tooltip.bs-tooltip-bottom .arrow::before {
    border-bottom-color: #354650;
    border-width: 0 16px 16px;
    margin-left: -15px;
    margin-bottom: -6px;
    bottom: 0;

}

.billing-table {
    display: block;
}
.billing-mobile-entry {
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    padding: 20px;
    position: relative;
    margin: 10px 0;
}
.billing-mobile-entry .amount span,
.billing-mobile-entry .date span,
.billing-mobile-entry .description span {
    color: #728B9B;
    font-size: 14px;
    line-height: 14px;
}
.billing-mobile-entry .status-container,
.billing-mobile-entry .amount,
.billing-mobile-entry .date,
.billing-mobile-entry .description {
    letter-spacing: 0.1px;
    line-height: 19px;
    font-size: 16px;
    color: #354650;
    margin: 10px 0;
}
.billing-mobile-entry .status-container {
    margin-top: 0;
}
.billing-mobile-entry .refund-menu-div {
    position: absolute;
    right: 0;
    top: 0;
}
.billing-mobile-entry .refund-menu-div .other-menu {
    margin: 20px 15px;
    cursor: pointer;
    padding: 0 5px;
}
.billing-mobile-entry .refund-menu {
    position: absolute;
    width: max-content;
    right: 40px;
    top: 4px;
    border-radius: 6px;
    padding: 16px 17px;
    border: 1px solid #E6ECF1;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,0.08);
    cursor: pointer;
    display: none;
}
.billing-mobile-entry .refund-menu-div .refund-menu.active {
    display: block;
}
.billing-mobile-entry .refund-menu img {
    margin-right: 4px;
}
.billing-mobile-list {
    display: none;
}
.settings-header-container {
    overflow: hidden;
    height: 70px;
    margin-bottom: 30px;
}
.settings-header-scroll {
    overflow-x: scroll;
}
#settings-header-mobile {
    display: none;
    height: 60px;
    clear: both;
    margin-bottom: 60px;
}
.mobile-header-entry {
    float: left;
    width: 33.33%;
    padding-top: 2px;
    text-align: center;
    border-bottom: 1px solid #C6D0D8;
    border-right: 1px solid #C6D0D8;
    color: #728B9B;
    font-size: 12px;
    line-height: 13px;
    height: 50px;
}
.mobile-header-entry:hover {
    text-decoration: none;
    color: #354650;
    background-color: #F2FCFF;
}
.mobile-header-entry:last-of-type {
    border-right: none;
}
.mobile-header-entry .img-container {
    height: 25px;
    width: 25px;
    display: flex;
    vertical-align: middle;
    margin: 0 auto 2px auto;
    align-items: center;
}
.mobile-header-entry .img-container img {
    margin: auto;
}
.mobile-header-entry.active {
    background-color: #F2FCFF;
    color: #354650;
    border-bottom: 3px solid #54D0FF;
}
.mobile-header-entry.active:hover {
    color: #354650;
}
@media (max-width: 700px) {
    .billing-table {
        display: none;
    }
    .billing-mobile-list {
        display: block;
    }
    .header-entry {
        font-size: 16px;
        line-height: 20px;
    }
    #payModal .modal-dialog, #payThankYouModal .modal-dialog, #refundModal .modal-dialog {
        width: 100%;
    }
    #settings-header {
        display: none;
    }
    #settings-header-mobile {
        display: block;
    }

}
.header-entry .default-img {
    display: block;
}
.header-entry .active-img {
    display: none;
}
.header-entry:hover > .default-img {
    display: none;
}
.header-entry:hover > .active-img {
    display: block;
}
.mobile-header-entry .default-img {
    display: block;
}
.mobile-header-entry .active-img {
    display: none;
}
.mobile-header-entry:hover > .img-container .default-img {
    display: none;
}
.mobile-header-entry:hover > .img-container .active-img {
    display: block;
}
@media (min-width: 675px) {
    .col-description {
        min-width: 100px;
    }
}
@media (min-width: 775px) {
    .col-description {
        min-width: 200px;
    }
}
@media (min-width: 875px) {
    .col-description {
        min-width: 300px;
    }
}
@media (min-width: 950px) {
    .col-description {
        min-width: 400px;
    }
}
@media (min-width: 1027px) {
    .col-description {
        min-width: 470px;
    }
}
@media (min-width: 1028px) {
    .col-description {
        min-width: 300px;
    }
}
@media (min-width: 1080px) {
    .col-description {
        min-width: 350px;
    }
}
@media (min-width: 1150px) {
    .col-description {
        min-width: 300px;
    }
}
@media (min-width: 1200px) {
    .col-description {
        min-width: 400px;
    }
}
@media (min-width: 1280px) {
    .col-status, .col-amount {
        min-width: 90px;
    }
    .col-date, .col-pay-button {
        min-width: 120px;
    }
    .col-description {
        min-width: 510px;
    }
    .col-other-menu {
        min-width: 40px;
    }
}
#content-form-bg.billing-content-form-bg {
    width: 100%;
    padding: 20px;
}
#content-form-bg.billing-content-form-bg h2 {
    margin: 0 15px;
    width: fit-content;
    display: inline-block;
}
@media (min-width: 1445px) {
    .col-status, .col-amount {
        min-width: 150px;
    }
    .col-date {
        min-width: 200px;
    }
    .col-pay-button {
        min-width: 120px;
    }
    .col-description {
        min-width: 510px;
    }
    .col-other-menu {
        min-width: 40px;
    }
}
.other-note {
    margin-bottom: 10px;
    text-align: center;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    background: #efefef;
    padding: 10px;
}
.no-data-table a {
    color: #00aff1;
}
.no-data-table a:hover {
    color: #00aff1;
    text-decoration: none;
}
#payModal .custom-radio .custom-control-indicator {
    width: 21px;
    height: 21px;
    border: 1px solid #c7d1d8;
    background-color: #FFF;
}

#payModal .custom-radio .custom-control-input:checked~.custom-control-indicator {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='4' fill='%2354cfff'/%3E%3C/svg%3E");
}

#payModal .custom-radio .custom-control-input:checked~.custom-control-indicator {
    background-color: #FFF;
}
#payModal .payment-option-entry {
    padding: 8px 15px;
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    font-size: 16px;
    letter-spacing: 0.1px;
    line-height: 33px;
    color: #445863;
    position: relative;
    display: flex;
    align-content: center;
    cursor: pointer;
    margin-bottom: 15px;
}
#payModal .payment-option-entry.active {
    border: 1px solid #BFEDFF;
    background-color: #F2FCFF;
}
#payModal .payment-option-entry img {
    margin-right: 12px;
}
#payModal .payment-option-entry .payment-radio {
    position: absolute;
    right: -6px;
    top: 10px;
}
#payModal .payment-option-entry .custom-radio {
    cursor: pointer;
}
#payModal .add-new {
    text-align: center;
    line-height: 33px;
    letter-spacing: 0.1px;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
}
#payModal .add-new img {
    margin-right: 12px;
}
#payModal .add-new a {
    color: #445863;
}
#payModal .add-new a:hover {
    color: #445863;
    text-decoration: none;
}
#payModal .amount-to-be-paid {
    margin-top: 20px;
    font-size: 24px;
    line-height: 28px;
}
#payModal.tc-custom-modal .description-header {
    margin-top: 10px;
    text-align: left;
    padding-bottom: 25px;
    margin-bottom: 0;
    border-bottom: 2px solid #C6D0D8;
}
#payModal.tc-custom-modal .select-payment {
    color: #445863;
    font-size: 16px;
    letter-spacing: 0.1px;
    line-height: 33px;
    margin-top: 13px;
    margin-bottom: 8px;
}
#payModal .message-div {
    display: none;
    margin-bottom: 15px;
}
#payModal .message-div .message-container.error {
    color: #ff372a;
}
#payModal .message-div .message-container.success {
    color: #5fdd4d;
}
.confirm-div {
    float: right;
    color: #55d0ff;
    cursor: pointer;
    margin-bottom: 15px;
}
.form-container {
    text-align: center;
    margin-top: 50px;
}
.tc-custom-modal .text-field {
    border: 1.5px solid #C6D0D8;
    border-radius: 6px;
    background-color: #F2F6FB;
    padding: 10px 15px;
    width: 50%;
    margin: auto;
    text-align: center;
    font-size: 18px;
    letter-spacing: 7px;
}

.tc-table thead th {
    font-size: 14px;
    padding: 8px 15px;
    color: #728B9B;
    line-height: 14px;
    font-weight: normal;
    border: none;
}
.tc-table tr {
    height: 80px;
    vertical-align: middle;
}
.tc-table td, .tc-table th {
    vertical-align: middle;
    font-size: 16px;
    line-height: 19px;
    color: #354650;
}
.tc-table.empty td, .tc-table.empty th {
    width: 100%;
}
.tc-table thead {
    background-color: #F2F6FB;
    font-size: 14px;
}
.tc-table thead tr {
    height: unset;
}
.tc-table .status, .billing-mobile-entry .status {
    padding: 6px 14px;
    width: max-content;
    border-radius: 15px;
    font-size: 14px;
    height: 30px;
    line-height: 18px;
}
.tc-table .not-paid, .billing-mobile-entry .not-paid {
    border: 1px solid rgba(255,47,79,0.08);
    background-color: rgba(255,47,79,0.07);
    color: #FF2F4F;
}
.tc-table .paid, .billing-mobile-entry .paid {
    border: 1px solid rgba(41,197,129,0.1);
    background-color: rgba(41,197,129,0.08);
    color: #29C581;
}
.tc-table .refunded, .billing-mobile-entry .refunded {
    border: 1px solid rgba(41,197,129,0.1);
    background-color: rgba(41,197,129,0.08);
    color: #29C581;
}
.tc-table .btn-blue, .billing-mobile-entry .btn-blue {
    background-color: #54D0FF;
    border-radius: 6px;
    padding: 11px 0;
    width: 90px;
    line-height: 18px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
}
.tc-table .btn-blue:hover, .billing-mobile-entry .btn-blue:hover {
    background-color: #00aff1;
}
.billing-mobile-entry .btn-blue {
    width: 100%;
    margin-top: 10px;
}
.tc-table .other-menu {
    cursor: pointer;
}
.tc-table .td-refund {
    position: relative;
    width: 35px;
}
.tc-table .td-refund .other-menu {
    padding: 0 5px;
}
.tc-table .refund-menu {
    position: absolute;
    right: 27px;
    top: 11px;
    width: max-content;
    background-color: #FFFFFF;
    border-radius: 6px;
    padding: 16px 17px;
    border: 1px solid #E6ECF1;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,0.08);
    display: none;
    cursor: pointer;
}
.tc-table .refund-menu img {
    margin-right: 4px;
}
.tc-table .refund-menu.active {
    display: block;
}
.tc-table {
    display: block;
}
@media (max-width: 700px) {
    .tc-table {
        display: none;
    }
}
.add-client-btn {
    color: #728B9B;
    line-height: 18px;
    font-weight: bold;
    font-size: 14px;
    background-color: #FFFFFF;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    border-left: 1px solid #C6D0D8;
    border-radius: 0;
}
.active-clients-title {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
.add-client-btn img {
    margin-right: 7px;
}
.tc-table tr.cancelled {
    background-color: #FFF9FA;
}
.tc-table td.red {
    color: #FF2F4F;
}
.table-btn {
    background: #FFF;
    border: 1px solid #DBE5EB;
    border-radius: 6px;
    font-size: 14px;
    font-weight: bold;
    line-height: 18px;
    color: #728B9B;
    padding: 11px 14px;
    margin: 0 3px;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}
.table-btn:hover {
    background-color: #F2FCFF;
    border: 1px solid #BFEDFF;
}
.table-btn img {
    margin-right: 5px;
}
#confirmPhoneModal .modal-dialog {
    width: 400px;
}
#confirmPhoneModal.tc-custom-modal button.close img {
    height: 12px;
    width: 12px;
}
#confirmPhoneModal.tc-custom-modal .description-header {
    margin-top: 28px;
    line-height: 35px;
    margin-bottom: 12px;
}
#confirmPhoneModal .form-container {
    margin-top: 23px;
    position: relative;
}
#confirmPhoneModal .form-container .text-field {
    width: 100%;
    height: 60px;
}
#confirmPhoneModal .btn-transparent {
    font-size: 14px;
    background: none;
    display: flex;
    color: #54D0FF;
    align-items: center;
    vertical-align: middle;
    margin: auto;
    text-transform: none;
    margin-bottom: 20px;
}
#confirmPhoneModal .btn-transparent img {
    margin-right: 8px;
}
.tc-table .other-menu {
    height: 40px;
    width: 25px;
    text-align: center;
    vertical-align: middle;
    display: flex;
    align-items: center;
    align-content: center;
}
.tc-table .other-menu:hover {
    background-color: #EFF5FA;
    border-radius: 3px;
}
.tc-table .other-menu img {
    margin: auto;
}
#confirmPhoneModal .message-div {
    position: absolute;
    width: 100%;
    top: -18px;
}
#confirmPhoneModal .message-area {
    color: #FF2F4F;
    font-size: 14px;
    line-height: 16px;
    background-color: #FFD8DE;
    padding: 6px 12px;
    border-radius: 4px;
    width: fit-content;
    margin: auto;
    border: 1px solid #FFC7CF;
}
#confirmPhoneModal .message-arrow {
    background-color: #FFD8DE;
    height: 12px;
    width: 12px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    margin: auto;
    position: relative;
    top: -5px;
    border-left: 1px solid #FFC7CF;
    border-bottom: 1px solid #FFC7CF;
}
#confirmPhoneModalSuccess .modal-dialog, #confirmPhoneModalSuccess .modal-content {
    width: 400px;
    height: 320px;
}
#confirmPhoneModalSuccess .img-container {
    margin-top: 82px;
}
.billing-entry {
    border: 1px solid #C6D0D8;
    padding: 15px 15px 20px 15px;
    border-radius: 8px;
    position: relative;
}
.billing-entry .menu {
    position: absolute;
    top: 15px;
    right: 15px;
}
.billing-entry .menu-icon {
    color: #C0CFD8;
    cursor: pointer;
}
.billing-entry .menu-options {
    position: absolute;
    width: max-content;
    right: 10px;
    top: 0;
    border-radius: 6px;
    background: #FFFFFF;
    border: 1px solid #E1E9F0;
    box-shadow: 0 -2px 5px 0 rgba(0,0,0,0.05), 0 5px 10px 0 rgba(53,70,80,0.1);
}
.billing-entry .menu-options .menu-option-entry {
    padding: 15px;
    font-size: 14px;
    line-height: 14px;
    cursor: pointer;
}
.billing-entry .menu-options img {
    height: 10px;
    width: 10px;
}
.billing-entry h4 {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0.11px;
    line-height: 18px;
    margin-bottom: 0;
}
.billing-entry p {
    font-size: 12px;
    color: #354650;
    line-height: 24px;
    margin-bottom: 0;
    letter-spacing: 0.07px;
}
.billing-entry p.faded {
    color: #728B9B;
    line-height: 14px;
    margin-top: 9px;
    display: flex;
}
.billing-entry p.faded .information-icon {
    font-size: 14px;
    font-weight: bold;
    color: #728B9B;
    margin-left: 5px;
    cursor: pointer;
}
.billing-entry p.faded .cancelled-label{
    display: none;
    margin-left: 5px;
}
.billing-entry p.date-range {
    font-size: 13px;
    margin-top: 5px;
}
.entry-title {
    float: left;
}
.entry-value {
    float: right;
}
.billing-data {
    margin-top: 16px;
}
.billing-data .data-entry {
    background-color: #EFF5FA;
    color: #728B9B;
    font-size: 14px;
    padding: 8px 11px;
    border-bottom: 1px solid rgba(198, 208, 216, 0.6);
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}
.billing-data .data-entry:last-of-type {
    border-bottom: none;
    border-radius: 0 0 4px 4px;
}
.billing-summary .data-entry {
    margin: 7px 0 7px 0;
}
.billing-summary .entry-title {
    font-size: 16px;
    font-weight: bold;
}
.billing-summary .entry-value {
    font-size: 16px;
    font-weight: bold;
    color: #54D0FF;
}
.days-not-reported {
    font-size: 12px;
    text-align: center;
    font-style: italic;
    letter-spacing: 0.07px;
    line-height: 15px;
    color: #FF2F4F;
    margin: 15px 0 10px;
    height: 15px;
}
.billing-entry .button-container button {
    font-weight: bold;
    font-size: 16px;
    line-height: 18px;
    padding: 13px;
    color: #FFFFFF;
    cursor: pointer;
}
.btn-tc-blue-generic {
    background-color: #54D0FF;
    color: #FFFFFF;
}
.btn-tc-blue-generic:hover {
    background-color: #00aff1;
}
.contact-link {
    text-align: center;
    color: #728B9B;
    font-size: 14px;
    font-weight: bold;
    line-height: 18px;
    margin-top: 15px;
    cursor: pointer;
}
.contact-link.clblock {
    opacity: 0.6;
    cursor: default;
}
.contact-link img {
    margin-right: 9px;
}
.billing-entry.cancelled {
    border: 1px solid rgba(255,47,79,0.3);
}
.billing-entry.cancelled .case-id {
    color: #FF2F4F;
}
.billing-entry.cancelled p.faded .cancelled-label{
    display: initial;
}
#requestInfoModal h4.modal-title {
    font-weight: bold;
    letter-spacing: 0.09px;
    line-height: 27px;
    font-size: 22px;
    margin-bottom: 20px;
}
#requestInfoModal .modal-dialog {
    max-width: 580px;
}
#requestInfoModal .modal-body {
    padding: 20px;
}
#requestInfoModal .infoEntry {
    border-top: 2px solid rgba(198, 208, 216, 0.5);
    padding: 9px 0;
}
#requestInfoModal .infoEntry:last-of-type {
    margin-bottom: 20px;
}
#requestInfoModal .infoTitle, #requestInfoModal .infoValue {
    float:left;
    font-size: 16px;
    line-height: 22px;
    color: #354650;
    vertical-align: top;
}
#requestInfoModal .infoTitle {
    width: 200px;
    color: #728B9B;
}
#requestInfoModal .infoValue {
    max-width: 335px;
}
#requestInfoModal .btn {
    margin-bottom: 0;
}

@media (min-width: 1200px) {
    .col-mlg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@media (min-width: 1390px) {
    .col-xxl-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}
#newInvoiceModal .modal-dialog {
    width: 400px;
}
#newInvoiceModal .modal-body {
    padding: 20px;
}
#newInvoiceModal .modal-title {
    text-align: center;
    position: relative;
    font-size: 20px;
}
#newInvoiceModal .modal-title .client-name {
    width: fit-content;
    margin: auto;
    color: #54D0FF;
    font-weight: bold;
    cursor: pointer;
    background-image: linear-gradient(to right, #54D0FF 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 10px 1px;
    background-repeat: repeat-x;
}
#newInvoiceModal .invoice-info {
    padding: 25px 20px;
    border: 1px solid #C6D0D8;
    border-radius: 10px;
    margin-top: 30px;
    position: relative;
}
#newInvoiceModal .invoice-info h4 {
    color: #354650;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    width: 120px;
    margin: auto;
    position: absolute;
    top: -18px;
    background: #FFFFFF;
    left: 0;
    right: 0;
}
#newInvoiceModal .invoice-info .number-of-hours {
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    background-color: #EFF5FA;
    height: 60px;
    width: 130px;
    margin: auto;
    display: block;
    color: #354650;
    font-size: 20px;
    line-height: 14px;
    text-align: center;
    vertical-align: middle;
}
#price-per-hour, #total-amount {
    background-color: #EFF5FA;
    border-radius: 4px;
    height: 40px;
    padding: 6px 15px 7px;
    margin-bottom: 5px;
    vertical-align: middle;
    align-items: center;
}
#price-per-hour .field-title, #total-amount .field-title {
    float: left;
    width: fit-content;
    color: #728B9B;
    font-size: 14px;
    line-height: 27px;
}
#price-per-hour .field-value, #price-per-hour .field-enter-new, #total-amount .field-value, #total-amount .field-enter-new {
    float: right;
    font-weight: bold;
    width: 70px;
    position: relative;
    cursor: pointer;
}
#price-per-hour .field-enter-new input, #total-amount .field-enter-new input {
    background: none;
    border: none;
    width: 100%;
    padding-left: 9px;
    font-weight: bold;
}
#price-per-hour .field-enter-new .save, #total-amount .field-enter-new .save {
    background: url(../img/check-list.svg);
    width: 17px;
    height: 13px;
    position: absolute;
    right: 0;
    top: 5px;
}
#price-per-hour .field-enter-new:before, #total-amount .field-enter-new:before {
    content: "$";
    position: absolute;
    left: 0;
}
#price-per-hour .field-value:after, #total-amount .field-value:after {
    content: " ";
    background: url(../img/Edit-gray.png);
    width: 14px;
    height: 13px;
    position: absolute;
    right: 0;
    top: 5px;
}
#price-per-hour .field-value:hover:after, #total-amount .field-value:hover:after {
    background: url(../img/Edit-hover.png);
}
#start-date, #end-date {
    font-weight: bold;
}
#date-range {
    position: relative;
    width: fit-content;
    margin: auto;
    padding-right: 20px;
    cursor: pointer;
}
#date-range:after {
    content: " ";
    background: url(../img/Edit-gray.png);
    width: 14px;
    height: 13px;
    position: absolute;
    right: 0;
    top: 5px;
}
#date-range:hover:after {
    background: url(../img/Edit-hover.png);
}

#newInvoiceModal .invoice-info .date-range {
    text-align: center;
    margin: 8px auto 18px;
}
#newInvoiceModal .tc-scheduling-fee {
    font-size: 12px;
    margin: auto;
    width: 192px;
    text-align: center;
    margin-top: 8px;
}
#optional-fields-button {
    background-image: linear-gradient(to right, #54D0FF 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 10px 1px;
    background-repeat: repeat-x;
    margin: 20px auto 0;
    width: fit-content;
    color: #54D0FF;
    font-weight: bold;
    font-size: 16px;
    line-height: 16px;
    padding-bottom: 4px;
    cursor: pointer;
}
#newInvoiceModal .btn {
    margin-bottom: 0;
}
#newInvoiceModal .invoice-number {
    padding: 10px 15px;
    font-size: 16px;
    background-color: #EFF5FA;
    border-radius: 6px;
    border: 1px solid #C6D0D8;
    display: block;
    width: 100%;
    margin-top: 20px;
}
#newInvoiceModal .input-description {
    font-size: 14px;
    line-height: 14px;
    color: #354650;
}
#newInvoiceModal .invoice-notes {
    background-color: #EFF5FA;
    border-radius: 6px;
    padding: 15px;
    border: 1px solid #C6D0D8;
    width: 100%;
    min-height: 100px;
    margin-top: 20px;
}
#newInvoiceModal .attach-scanned-invoice {
    width: fit-content;
    margin: 10px auto 8px;
    font-size: 16px;
    line-height: 21px;
    cursor: pointer;
}
#tc-fee-value {
    font-weight: bold;
}
#client-names-list {
    border-radius: 6px;
    border: 1px solid #E1E9F0;
    box-shadow: 0 -2px 5px 0 rgba(0,0,0,0.05), 0 5px 20px 0 rgba(53,70,80,0.2);
    max-height: 200px;
    overflow-y: scroll;
    position: absolute;
    background: #FFFFFF;
    width: 100%;
    z-index: 1;
    top: 30px;
}
#client-names-list .client-name-value {
    float: left;
    font-size: 16px;
}
#client-names-list .client-name-case {
    float: right;
    font-size: 12px;
    line-height: 24px;
    color: #728B9B;
}
#client-names-list .client-name-entry {
    padding: 8px 15px;
    cursor: pointer;
}
#client-names-list .client-name-entry:hover, #client-names-list .client-name-entry.selected {
    background-color: #EFF5FA;
}
.date-picker-wrapper {
    z-index: 1100;
    width: min-content;
}
.tc-custom-modal.default-width .modal-dialog {
    max-width: 340px;
}
.tc-custom-modal .strikethrough {
    border-top: 1px solid #C6D0D8;
    position: relative;
    margin: 16px 0;
}
.tc-custom-modal .strikethrough .text {
    padding: 0 5px;
    background: #FFFFFF;
    margin: auto;
    display: block;
    width: fit-content;
    position: absolute;
    left: 0;
    right: 0;
    top: -18px;
    font-size: 16px;
    line-height: 33px;
}
.tc-custom-modal .mark-as-paid {
    color: #445863;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.1px;
    text-align: center;
    vertical-align: middle;
    margin-top: 36px;
    cursor: pointer;
}
.tc-custom-modal .desc-text {
    text-align: center;
    font-size: 16px;
    letter-spacing: 0.09px;
    line-height: 20px;
    color: #354650;
    width: 222px;
    margin: 17px auto 18px;
}
#newInvoiceConfirmModal .description-header {
    font-size: 22px;
    width: 241px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:19px;
}
.clients-page .mobile-header-entry {
    width: 50%;
}
#settings-header-mobile.clients-page {
    margin-bottom: 15px;
}
@media (max-width: 700px) {

}

@media (max-width: 576px) {
    #billingRowContainer .col-12 {
        padding: 0;
    }
    #content-form-bg.billing-content-form-bg.client-active-page {
        padding: 0 10px;
    }
    #content-form-bg.client-active-page .billing-container {
        padding: 0 5px;
    }
    #content-form-bg.client-active-page .billing-container h2 {
        font-size: 22px;
        margin: 0;
        line-height: 33px;
        letter-spacing: 0.09px;
    }
    #content-form-bg.client-active-page .billing-container .active-clients-title {
        margin-bottom: 17px;
    }
    #newInvoiceModal .modal-dialog {
        width: auto;
    }
}


.field-visable-value {
    display: none;
    float: right;
    font-weight: bold;
    width: 60px;
    position: relative;
}
.notEditable .taxesCaption,.billing-summary .taxesCaption{
    font-size: 12px;
    margin: 0;
    text-align: right;
    color: rgba(53, 70, 80, 0.6);
    font-family: Lato, sans-serif;
}




#sendInvoiceModal.compact .gray-entries {
    padding-bottom: 0!important;
    border-bottom: 0!important;
}
#sendInvoiceModal.compact .modal-body {
    padding: 10px 19px!important;
}
#sendInvoiceModal.compact .modal-body .btn {
    line-height: 30px;
    margin-bottom: 14px;
}
#sendInvoiceModal.compact .modal-img {
    margin: 20px auto 0;
}
#sendInvoiceModal.compact .total-title {
    top: -17px;
    font-weight: normal;
    text-align: center;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    background-color: #ffffff;
    width: 70px;
    color: #354650;
    font-size: 16px;
    line-height: 27px;
}
#sendInvoiceModal.compact .entry {
    display: none;
}
#sendInvoiceModal.compact .entry .operator {
    display: none;
}
#sendInvoiceModal.compact .entry:last-child {
    position: relative;
    border-radius: 10px;
    margin-top: 26px;
    border: 1px solid #C6D0D8;
    display: block;
}
#sendInvoiceModal.compact .entry:last-child .entry-value {
    float: none;
    width: 100%;
}
#sendInvoiceModal.compact .entry:last-child .entry-value p {
    text-align: center;
    padding: 0;
    margin: 0;
    line-height: 18px;
    font-family: Lato, sans-serif;
    font-size: 12px;
    color: #728B9B;
    padding-bottom: 22px;
}
#sendInvoiceModal.compact .entry:last-child .entry-value .total-value {
    color: #54D0FF;
    font-size: 36px;
    line-height: 27px;
    display: block;
    text-align: center;
    padding: 26px 10px;
    font-weight: normal;
    padding-bottom: 12px;
}




#sendInvoiceModal .description-header, #markAsPaidModal .description-header {
    margin-top: 20px;
    font-size: 22px;
    line-height: 27px;
}
.modal-img {
    margin: 35px auto 0;
    display: block;
}
#sendInvoiceModal .entry,
#markAsPaidModal .entry {
    background-color: #EFF5FA;
    clear: both;
    font-size: 14px;
    color: #728B9B;
    line-height: 27px;
    padding: 2px 11px;
    border-bottom: 1px solid #C6D0D8;
}
#sendInvoiceModal .gray-entries,
#markAsPaidModal .gray-entries {
    padding-bottom: 17px;
    border-bottom: 1px solid #C6D0D8;
    margin-bottom: 15px;
}
#sendInvoiceModal .entry:first-of-type,
#markAsPaidModal .entry:first-of-type {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
#sendInvoiceModal .entry:nth-last-child(2),
#markAsPaidModal .entry:nth-last-child(2) {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom: none;
}
#sendInvoiceModal .entry:last-of-type,
#markAsPaidModal .entry:last-of-type {
    border-bottom: none;
    background: #FFFFFF;
}
#sendInvoiceModal .entry-title,
#markAsPaidModal .entry-title {
    float: left;
}
#sendInvoiceModal .entry-title.total-title,
#markAsPaidModal .entry-title.total-title {
    font-size: 16px;
    line-height: 27px;
    color: #354650;
    font-weight: bold;
}
#sendInvoiceModal .entry-value,
#markAsPaidModal .entry-value {
    float: right;
    width: 90px;
    text-align: right;
}
#sendInvoiceModal .entry-value .total-value,
#markAsPaidModal .entry-value .total-value {
    font-weight: bold;
}
#sendInvoiceModal .entry .operator,
#markAsPaidModal .entry .operator {
    width: 12px;
    display: inline-block;
    text-align: right;
    font-size: 20px;
}
#sendInvoiceModal .tc-modal-desc,
#markAsPaidModal .tc-modal-desc {
    color: #354650;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    margin-bottom: 25px;
}
.tc-custom-modal.small-width .modal-dialog {
    max-width: 260px;
    margin-left: auto;
    margin-right: auto;
}
.tc-custom-modal.small-width .modal-img {
    margin-top: 30px;
}
.tc-custom-modal.small-width .description-header {
    font-size: 22px;
    font-weight: bold;
    line-height: 27px;
    margin-top: 20px;
}
.tc-custom-modal.small-width .tc-modal-desc {
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #445863;
    margin-bottom: 30px;
}
#successfulPaymentModal .description-header {
    font-size: 24px;
    line-height: 27px;
    margin-bottom: 40px;
}
#markAsPaidModal .entry-value {
    width: 55px;
    text-align: right;
}
#billingRowContainer.invoices-row .billing-entry {
    padding-top: 58px;
    position: relative;
}
#billingRowContainer.invoices-row .ribbon {
    text-transform: uppercase;
    position: absolute;
    top: 16px;
    left: -7px;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.02px;
    line-height: 27px;
    height: 30px;
    padding: 0 20px 0 25px;
}
#billingRowContainer.invoices-row .ribbon:before {
    content: "";
    height: 0;
    width: 0;
    display: block;
    position: absolute;
    bottom: -8px;
    left: -2px;
    border-bottom: 8px solid transparent;
    border-right: 8px solid #004a70;
}
#billingRowContainer.invoices-row .ribbon:after {
    content: "";
    height: 0;
    width: 0;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-right: 8px solid #FFF;
}
#billingRowContainer.invoices-row .ribbon.blue-ribbon {
    background-color: #F2FCFF;
    border: 1px solid #BFEDFF;
    color: #54D0FF;
    border-right: none;
}
#billingRowContainer.invoices-row .ribbon.blue-ribbon:before {
    border-right: 8px solid #BFEDFF;
}
#billingRowContainer.invoices-row .ribbon.green-ribbon {
    background-color: #EEFBF5;
    border: 1px solid rgba(41,197,129,0.1);
    color: #29C581;
    border-right: none;
}
#billingRowContainer.invoices-row .ribbon.green-ribbon:before {
    border-right: 8px solid rgba(41,197,129,0.1);
}

#billingRowContainer.invoices-row .ribbon.yellow-ribbon {
    background-color: #FEF6E9;
    border: 1px solid rgba(245,166,35,0.2);
    color: #F7B03B;
    border-right: none;
}
#billingRowContainer.invoices-row .ribbon.yellow-ribbon:before {
    border-right: 8px solid rgba(245,166,35,0.2);
}

#billingRowContainer.invoices-row .ribbon.gray-ribbon {
    background-color: #EFF5FA;
    border: 1px solid #C6D0D8;
    color: #728B9B;
    border-right: none;
}
#billingRowContainer.invoices-row .ribbon.gray-ribbon:before {
    border-right: 8px solid #C6D0D8;
}
.disabled {
    cursor: not-allowed !important;
}
.drp_top-bar {
    padding-top: 25px !important;
}
.normal-top {
    display: none !important;
}
.date-picker-wrapper .month-wrapper table tbody tr:hover {
    background-color: #9cdbf7;
}
#cancelClientModal .description-header {
    font-size: 22px;
    line-height: 31px;
    text-align: left;
    margin-top: 10px;

}
#cancelClientModal .modal-body {
    padding: 10px 20px;
}
#cancelClientModal .cancel-client-textarea {
    background-color: #EFF5FA;
    border-radius: 6px;
    border: 1px solid #C6D0D8;
    width: 100%;
    height: 135px;
    margin-bottom: 15px;
    padding: 15px;
    font-size: 16px;
    color: #728B9B;
    line-height: 14px;
}
#previewUpload {
    margin-left: auto;
    margin-right: auto;
    display: block;
}


/*MAX*/
/*NEW STYLES FOR SETTINGS*/


.new-settings{
    max-width: 500px;
}

.new-settings #profile-settings{
    border: none;
    padding: 0;
}

.new-settings #profile-settings-head h2 {
    font-weight: normal;
    font-size: 24px;
    margin-bottom: 0px;
    margin-top: 5px;
}

.new-settings #profile-settings-head hr{
    margin-bottom: 30px;
}

.new-settings #profile-settings h2{
    font-weight: normal;
    font-size: 30px;
}

.new-settings #profile-settings hr {
    border-top: 1px solid rgba(0,0,0,.1);
}

 #profile-new-settings-form .input-label{
    font-weight: normal;
 }

.new-settings #profile-settings-head .stop-receiving-clients {
    font-size: 16px;    
    vertical-align: middle;
    text-transform: none;
    display: inline-block;
    color: #FF2F4F;
    cursor: pointer;
    margin-right: 0px;
    height: 50px;
    line-height: 50px;
    padding-left: 11px;
}

.new-settings #profile-settings-head .question {
    margin-top: 18px;
}

.new-settings .vr {
    height: 45px;
    width: 1px;    
    background-color: #CCD8E2;
    margin-top: 8px;
}

.new-settings #profile-new-settings-form .form-control {
    font-size: 16px;
    line-height: 55px;
    background-color: #F2F6FB;
    border-radius: 6px;
    border-color: #BECAD3;
    height: 55px;
}


.password-change {
    display: block;
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #C6D0D8;
    padding-left: 35px;
    cursor: pointer;
}

.password-change:before {
    content: url('../img/password.svg');
    display: block;
    position: absolute;
    top: 2px;
    left: 11px;
}

.new-settings .advanced-settings-info{
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
}

#profile-new-settings-form .form-control:focus {
    border: 1px solid #54D0FF;
    box-shadow: none;
}

.new-settings #profile-settings-head hr {
    border-top: 1px solid #C6D0D8;
    margin-top: 0;
}



#profile-new-settings-form .advanced-settings-button {
    cursor: pointer;
    border-color: #55d0ff !important;
    background-color: #55d0ff !important;
    font-size: 14px;
    height: 50px;
    border-radius: 6px;
    width: 230px;
    line-height: 50px;
    padding: 0;
    margin: 25px auto 40px auto;
    color: #fff;
}

#profile-new-settings-form .advanced-settings-button:hover {
    background-color: #00B9FF !important;
}

#profile-new-settings-form .btn-settings-small {
    height: 30px;
    width: 65px;
    border-radius: 4px;
    line-height: 28px;
    margin: 0 auto 5px auto;
}

#profile-new-settings-form .advanced-settings-expand-button {
    font-size: 16px;
    height: 55px;
    background-color: #fff;
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    color: #354650;
    cursor: pointer;
    vertical-align: middle;    
}

#profile-new-settings-form .advanced-settings-expand-button:hover {
    border: 1px solid #54D0FF;
} 

#profile-new-settings-form .cv-button {
    font-size: 16px;
    height: 55px;
    background-color: #fff;
    border: 1px dashed #C6D0D8;
    border-radius: 6px;
    color: #354650;
    cursor: pointer;
    vertical-align: middle;       
}

#profile-new-settings-form .cv-button.active {
    cursor: default;
    padding-left: 5px;
}

#profile-new-settings-form .cv-button.active:hover {
    border: 1px dashed #FF2F4F;
}

#profile-new-settings-form .cv-margin {
    margin-top: 20px;
}

#profile-new-settings-form .cv-button:hover {
    border: 1px dashed #54D0FF;
}

#profile-new-settings-form .cv-button:focus {
    box-shadow: none;
}

#profile-new-settings-form .cv-label{
    font-size: 14px;
    color: #728B9B;
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 7px;
}

#profile-new-settings-form .advanced-settings-recommend {
    background-color: #EBFAFF;
    border-radius: 6px;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-right: 30px;
    padding-left: 30px;
}

.new-settings .gear-icon {
    background: url('../img/settings-blue.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.new-settings .cv-icon {
    background: url('../img/upload.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 20px;
    padding-right: 20px;
}

.new-settings .cv-icon.active {
    background: none; 
    display: inline-block;
    padding-left: 0px;
    padding-right: 30px;
    width: 90%;
    text-align: left;
}

.new-settings .cv-delete {
    background: url('../img/cv-del.svg') no-repeat right center;            
    display: inline-block;
    right:0;
    padding-left: 0px;
    padding-right: 30px;
    cursor: pointer;
}

.new-settings .gender-item .gender-male{
    background: url('../img/male1.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.new-settings .gender-item.active .gender-male{
    background: url('../img/male-active.svg') no-repeat left center;            
}

.new-settings .gender-item .gender-female{
    background: url('../img/female.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.new-settings .gender-item.active .gender-female{
    background: url('../img/female-active.svg') no-repeat left center;            
}

.new-settings .advanced-settings-label {
    text-align: center;
    font-size: 20px;
    width: 100%;

}


.gender-item{
    width: 100%;
    padding: 0;
    font-size: 16px;
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    vertical-align: middle;
    white-space: normal;     
    margin-bottom: 15px;
    text-align: center;
}

.gender-item:hover{
   border: 1px solid #54D0FF;
}

.gender-item.active{
    border: 1px solid #54D0FF;
    background-color: #F3FCFF;
}

.gender-item label {
    vertical-align: middle;
    margin: 0;
    display: block;
    width: 100%;
    line-height: 55px;
    cursor: pointer;
}

.gender-label{
  display: inline-block;  
}

.gender-radio, .radio-input, .move-checkbox{
 opacity: 0;
 width: 1px;
}

.radio-item{
    width: 100%;
    padding: 0;
    font-size: 16px;
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    display: inline-block;
    vertical-align: middle;
    white-space: normal;    
    cursor: pointer;
}

.radio-item:hover{
  border: 1px solid #54D0FF;
}

.radio-item.active{
    border: 1px solid #54D0FF;
    background-color: #F3FCFF;
}

.radio-label{
    vertical-align: middle;
    margin: 0;
    display: block;
    width: 100%;   
    line-height: 50px;     
    text-align: center; 
    cursor: pointer;   
}

#advanced-settings-section .pl-2{
    padding-left: .75rem !important;
}
#advanced-settings-section .pr-2{
    padding-right: .75rem !important;
}

.ready2move {    
    width: 100%;    
    border: 1px solid #C6D0D8;
    background-color: #FFF;
    border-radius: 6px;    
    padding: 0;
    font-size: 16px;
    height: 55px;
    position: relative;
}

.ready2move:hover{
    border: 1px solid #54D0FF;
}

.ready2move.active {
    border: 1px solid #54D0FF;
    background-color: #F3FCFF;
}

.ready2move label{
    vertical-align: middle;
    margin: 0;
    display: block;
    width: 100%;
    line-height: 55px;
    cursor: pointer;
}



.move-checkbox-custom {
    width: 25px;
    height: 25px;
    border: 1px solid #C6D0D8;
    border-radius: 3px;
    position: relative;
    float: left;
    margin-top:15px;
    margin-left: 15px;
    margin-right: 10px;
}
.move-checkbox:checked + .move-checkbox-custom::before {
    content: url('../img/check-white1.svg');
    display: block;
    position: absolute;
    top: -17px;
    left: 5px;
}
.move-checkbox-custom,
.move-checkbox:checked + .move-checkbox-custom::before {
    border-radius: 3px;
}

.move-checkbox:checked + .move-checkbox-custom{
    border: 1px solid #54D0FF;
    background-color: #54D0FF;
}


.light_selector .select2-container
{
    width: 100% !important;
}


.light_selector .select2-container--default .select2-selection--multiple
{
  background: #F2F6FB;
  border: 1px solid #C6D0D8;
  border-radius: 6px;
  min-height: 50px;
  padding-left:10px;
  padding-right:10px;
}

.light_selector .select2-container--default.select2-container--focus .select2-selection--multiple{
  border: 1px solid #54D0FF; 
}
.light_selector .select2-container--default .select2-results > .select2-results__options {
  max-height: 200px !important;
}
.light_selector .select2-container--open .select2-dropdown--below {
  transform: none !important;
}
.light_selector .select2-container--open .select2-dropdown--above {
  transform: none !important;
}

.light_selector .select2-container .select2-search--inline .select2-search__field {
  font-size: 16px;  
  margin: 0;
  padding-top: 12px;
}
 
.light_selector .select2-container--default .select2-results .select2-results__option:first-child {
  display: list-item;
}

.light_selector .select2-container--default .select2-selection--multiple .select2-selection__rendered{
  padding: 0;    
}

 .light_selector .select2-container--default .select2-selection--multiple .select2-selection__choice{
  margin-top: 9px;
  margin-right: 10px;
  font-size: 16px;
  background-color: #D2F3FF;
  border-radius: 20px;
  height: 30px;
  line-height: 28px;
  padding-left: 15px;
  padding-right: 10px;
  border:none;
  max-width: 100%;
  text-overflow: clip;
  white-space: normal;
  overflow: hidden;
 }




.light_selector.languages .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#E5E9FF;
    border: 1px solid #DBDFF6;
}


.light_selector.religions .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#DEE6EE;
    border: 1px solid #D9DFE6;
}

.light_selector.skills .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#FFE9D8;
    border: 1px solid #FFDAC6;
}

.light_selector.trainings .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#DDF9ED;
    border: 1px solid #CFF4E4;
}
 
.light_selector.works .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#DEE6EE;
    border: 1px solid #D9DFE6;
}

.light_selector.educations .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:#DEE6EE;
    border: 1px solid #D9DFE6;
}


.light_selector .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  float: right;
  margin-left: 5px;
  margin-right: 0px;
  font-size: 22px;
  font-weight: 500;
}
.language-select{
  /*display: none;*/
  opacity: 0;
}

.select2-container--default .select2-results > .select2-results__options {
  max-height: none !important;
}


.new-settings .question{
  background: url('../img/question.svg') no-repeat center center;
  width: 14px;
  height: 14px;
  margin-left: 6px;
  margin-bottom: 17px;
  vertical-align: middle;
  display: inline-block;  
  position: relative;
  cursor: pointer;
}

#profile-settings-head .account-setting{
    /*padding: 0 0 20px 0;*/
    margin: 10px 0;
    height: 100px;
    position: absolute;
    right: 0px;
    z-index: 1;
}

.label-error{
  font-size: 14px;
  color: #FF2F4F;
  margin-top: 7px;
  display: block;
}

.user-block{
    border: 1px dashed #C6D0D8;
    border-radius: 10px;
    background-color: #FFF;    
    padding-top: 20px;    
}



.photo.active{
    padding-bottom: 0;
    border: 1px solid #BECAD3;
    background-size: cover;
    /*background-size: contain; */
    background-position:  top center;
    margin: 0 auto;
    padding-top: 0;
    height: 300px;
    width: 300px;
}

.photo.active:hover{
    padding-bottom: 0;
    border: 1px solid #54D0FF;
}

/*.photo:hover{
    border: 1px dashed #54D0FF;
    background-color: #F3FCFF;
}*/

.user-block .user-title{
    margin-top: 103px;
    font-size: 20px;
}

.user-block.picture-testimonials .user-title{
    padding: 0 20px;
}

.user-block .user-descr{
    margin-top: 10px;
    font-size: 14px;
    color:#728B9B;
    line-height: 20px;
}



.photo .photo-update {
    position: absolute; 
    bottom: 1px;    
    height: 55px;    
    opacity: 0.8;
    width: 298px;
    color: #fff;
    line-height: 55px;    
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    background-color: #5f697a;
    cursor: pointer;

}

.photo .photo-update .photo-icon {
    display: inline-block;
    padding-left: 30px;
    /*padding-right: 30px;*/
    font-size: 14px;
    background: url('../img/photo-white.svg') no-repeat left center;                
}


.settings-clients{
    width: 100%;
    height: 105px;
    background: url('../img/clients.png') no-repeat center center;
    margin-top: 10px;
    margin-bottom: 10px;
}

#referal_popup .modal-header {
    margin-bottom: 0;
}

.referal-logo{
    width: 100%;
    height: 105px;
    background: url('../img/referal.png') no-repeat center center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.referal-sent {
    width: 100%;
    height: 105px;
    background: url('../img/sent-link.png') no-repeat center center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.referal-btn {
    font-size: 16px;
    height: 55px;
    background-color: #fff;
    border: 1px solid #C6D0D8;
    border-radius: 6px;
    color: #354650;
    cursor: pointer;
    vertical-align: middle;    
}

.link-copied{
    border: 1px solid #54D0FF;
    background-color: #F3FCFF;
}

.referal-btn:hover{
    border: 1px solid #54D0FF;
}

.referal-btn:focus{
    box-shadow: none;
}

.referal-email-icon {
    background: url('../img/refer-email.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.referal-sms-icon {
    background: url('../img/refer-sms.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.referal-copy-icon {
    background: url('../img/refer-copy.svg') no-repeat left center;            
    display: inline-block;
    padding-left: 30px;
    padding-right: 30px;
}

.link-copied-icon{
    background: url('../img/done-blue.svg') no-repeat left center; 
}

.bank-account-logo {
    width: 100%;
    height: 105px;
    background: url('../img/bank-account-logo.png') no-repeat center center;
    margin-top: 10px;
    margin-bottom: 10px;
}


@media (max-width: 355px) {
    .new-settings #profile-settings-head h2, .new-settings #profile-settings h2{
        font-size: 25px;    
    }    
    .new-settings #profile-settings-head .stop-receiving-clients {
        font-size: 14px;
        margin-top: 0px;
    }
    .new-settings #profile-settings-head .question {
        margin-bottom: 0px;
    }


    .new-settings .vr {
        padding-left: 10px;

    }

    .ready2move{
     font-size: 14px;   
    }

}

@media (max-width: 700px) {
    .new-settings-container{
        margin-top: -70px;
    }
}


@media (max-width: 576px) {

    .photo, .photo.active {
        width: 100%;
        height: 100%;
    }
/*
    .photo .photo-title {
        margin-top: 170px;
    }*/

    .photo .photo-descr  {
        font-size: 14px;
        width: 230px;
        margin: 0 auto;
        margin-top: 15px;
    }

    .ratio {
        width: 100%; /* здесь можно установить любую нужную ширину */
    }

    .ratio-inner {
        position: relative;
        height: 0;
        border: none;
    }

    .ratio-content {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .ratio-1-1 {
        padding-top: 100%; /* 100% ширины делим на 4 и умножаем на 3 */
    }

    .photo .photo-update {
        position: absolute;
        bottom: 0;
        left: 0;
        height: 55px;
        opacity: 0.8;
        width: 100%;
     
    }

    .photo .photo-update .photo-icon {
       font-size: 1rem;
    }

}

.tc-modal {
    -webkit-overflow-scrolling: touch;
}

.kebab {
    background: url('../img/kebab.svg') no-repeat center; 
    height: 30px;
    width: 21px;
    margin-top: 10px;
    cursor: pointer;  
    display: inline-flex;   
    border-radius: 4px; 
}

.icon-aboutme {
    background: url('../img/profile-active.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-location {
    background: url('../img/location.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-skills {
    background: url('../img/skills.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-testimonials {
    background: url('../img/testimonials2.svg') no-repeat center;
    height: 15px;
    width: 14px;
    display: inline-block;   
}
.icon-education {
    background: url('../img/education.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-experience {
    background: url('../img/experience.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-contacts {
    background: url('../img/contacts.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

.icon-resume {
    background: url('../img/resume.svg') no-repeat center; 
    height: 15px;
    width: 14px;
    display: inline-block;   
}

#account-activator {
    border-radius: 6px;
    box-shadow: 0 2px 10px 0 rgba(53,70,80,0.2);
    width: 210px;
    top:-25px;
    background: rgba(255, 255, 255, 1);



}

#settings-header{
    margin-bottom: 0;
}

#provider-name{
    font-size: 24px;
    text-align: center;
    display: inline-block;
}

.edit-pen{
    background: url('../img/edit-pen.svg') no-repeat center; 
    height: 30px;
    width: 30px;
    cursor: pointer; 
    display: inline-block;
    border-radius: 4px;
    margin-bottom: -8px;
}

.edit-pen-long{
    background: url('../img/edit-pen.svg') no-repeat; 
    background-position: 6px center;
    height: 30px;
    width: 60px;
    cursor: pointer; 
    display: inline-block;
    border-radius: 4px;
    padding-right: 6px;
    color: #869AAA;
    font-size: 14px;
    line-height: 30px;

}

.add-pen-long{
    background: url('../img/add-pen-gray.svg') no-repeat; 
    background-position: 10px center;
    height: 30px;
    width: 60px;
    cursor: pointer; 
    display: inline-block;
    border-radius: 4px;
    padding-right: 6px;
    color: #869AAA;
    font-size: 14px;
    line-height: 30px;

}


.edit-pen:hover, .edit-pen-long:hover, .kebab:hover, .add-pen-long:hover{
    background-color:#F0F2F4; 
}

#provider-specialization{
    color: #869AAA;
    font-size: 14px;
}

.left-minus-1 {
    margin-left: -1px;
}

.mt-30 {
    margin-top: 30px !important;
}
.mt-25 {
    margin-top: 25px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mt-15 {
    margin-top: 15px !important;
}
.mt-10 {
    margin-top: 10px !important;
}


.mb-50 {
    margin-bottom: 50px !important;
}
.mb-40 {
    margin-bottom: 40px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-20 {
    margin-bottom: 20px !important;
}
.mb-15 {
    margin-bottom: 15px !important;
}
.mb-10 {
    margin-bottom: 10px !important;
}

.pl-30 {
    padding-left: 30px !important;
}

.pr-30 {
    padding-right: 30px !important;
}


.advanced-settings-subtitle {
    font-size: 20px;
    margin-left: 15px;
    display: inline-block;
}

.picture-photo{
    background: url(../img/photo2.png) no-repeat top center;    
    background-size: 130px 100px;
    background-origin: content-box;
}

.picture-aboutme {
    background: url(../img/aboutme2.png) no-repeat top center;
    background-size: 130px 100px;
    background-origin: content-box;
}

.picture-skills {
    background: url(../img/skills2.png) no-repeat top center;
    background-size: 130px 100px;
    background-origin: content-box;
}
.picture-testimonials {
    background: url(../img/testimonials2.png) no-repeat top center;
    background-size: 130px 100px;
    background-origin: content-box;
}
.picture-education {
    background: url(../img/education2.png) no-repeat top center;
    background-size: 130px 100px;
    background-origin: content-box;
}
.picture-experience {
    background: url(../img/experience2.png) no-repeat top center;
    background-size: 130px 100px;
    background-origin: content-box;
}

.user-param-title{
    color: #869AAA;
    font-size: 16px;
    margin-bottom: 5px;
}
.user-param-value{
    font-size: 16px;
}

.user-map {
    height: 100px;
    background-color: #869AAA;
    border-radius: 6px;
}

.cert {
    height: 30px;
    background-color: #EAF9FF;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #DAF5FF;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}
.train {
    height: 30px;
    background-color: #DDF9ED;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #CFF4E4;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}
.skill {
    height: 30px;
    background-color: #FFE9D8;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #FFDAC6;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}

.work {
    height: 30px;
    background-color: #E5E9FF;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #DBDFF6;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}

.education {
    height: 30px;
    background-color: #E5E9FF;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #DBDFF6;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}

.lang {
    height: 30px;
    background-color: #E5E9FF;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;
    border: 1px solid #DBDFF6;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}

.drive {
    height: 30px;
    background-color: #F7E5FF;
    border-radius: 17px;
    padding-left: 11px;
    padding-right: 11px;
    display: inline-block;
    line-height: 28px;    
    border: 1px solid #F4DDFF;
    color: #728B9B;
    margin-top: 10px;
    margin-right: 10px;
}

.address-map {
    width: 100%;
    height: 100px;
    border-radius: 6px;
}

.settingsModal {
    color: #354650;
    font-family: 'Lato', sans-serif;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}


.settingsModal.settingsSmall {
    overflow-y: auto;
}


.settingsModal .modal-header {
    position: relative;
    border: none;
    padding: 0;
    display: block;
    margin-bottom: 0px;    
}

.settingsModal .modal-dialog {
    width: 480px;
    position: absolute;
    top: 0;    
    left: 50% !important;
    transform: translate(-50%) !important;
}

.settingsModal.settingsSmall .modal-dialog {
    width: 340px;
}

.settingsModal.settingsSmall .modal-header {
    margin-bottom: 25px;
}

.settingsModal.settingsSmall .modal-title {
    line-height: 28px;
}

.settingsModal .btn-save {
    height: 50px;
    cursor: pointer;
    margin-top: 20px;
}

.settingsModal button.close {
    position: absolute;
    right: 10px;
    top: 7px;
    cursor: pointer;
    z-index: 2;
}

.settingsModal .modal-title {
    display: inline-block;
    font-size: 20px;
    line-height: 20px;
    text-align: left;
    vertical-align: top;
    max-width: 300px;
}

.settingsModal .modal-content {
    padding: 30px;
    border-radius: 10px;
}

.settingsModal .modal-body {
    padding: 0;
}

.settingsModal .input-label {
    color: #728B9B;
    margin-top: 15px;
    margin-bottom: 15px;
    line-height: 16px;
}


.settingsModal .input-label span {
    color: #728B9B;
    font-size: 12px;    
}


.settingsModal .form-control {
    font-size: 16px;
    line-height: 50px;
    background-color: #F2F6FB;    
    border-radius: 6px;
    height: 50px;
    border: 1px solid #C6D0D8;
    margin-bottom: 0px;
}

.settingsModal  .form-control:focus {
    border: 1px solid #54D0FF;
    box-shadow: none;
}

.settingsModal .question {
    background: url(../img/question.svg) no-repeat center center;
    width: 14px;
    height: 14px;
    margin-left: 5px;
    vertical-align: middle;
    display: inline-block;
    position: relative;
    cursor: pointer;
}

.settingsModal .label-error {
    margin-top: 5px;
    margin-bottom: 0;
}

#years_of_experience_val, #price_hour_val {
    display: inline-block;
    font-size: 24px;
    padding-left: 33px;
}

#price_day_val{
    font-size: 11px;
    color: #869AAA;
}


.settingsModal .param-list-item {
    width: 100%;
    margin-bottom: 15px;
    border: 1px solid #C6D0D8;
    background-color: #FFF;
    border-radius: 6px;
    padding: 0;
    font-size: 16px;
    height: 50px;
    position: relative;
}

.param-list-item:last-child{
    margin-bottom: 4px;
}

.settingsModal .param-list-item:hover {
    border: 1px solid #54D0FF;
}

.settingsModal .param-list-item.active {
    border: 1px solid #54D0FF;
    background-color: #F3FCFF;
}

.settingsModal .param-list-label, .settingsModal .param-list-radio-custom {
    display: inline-block;
    vertical-align: middle;
}

.param-list-radio-custom {
    width: 21px;
    height: 21px;
    border: 1px solid #C6D0D8;
    border-radius: 3px;
    position: relative;
    float: left;
    margin-top: 15px;
    margin-right: 15px;
}


.param-list-item label {
    vertical-align: middle;
    margin: 0;
    display: block;
    width: 100%;
    line-height: 43px;
    cursor: pointer;
    padding-left: 15px
}

.param-list-radio {
    display: none;
}

.param-list-radio:checked + .param-list-radio-custom::before {
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    right: 4px;
    bottom: 4px;
    left: 4px;
    background: #54D0FF;    
    border-radius: 2px;
}
.param-list-radio-custom,
.param-list-radio:checked + .param-list-radio-custom::before {
    border-radius: 50%;
}

.param-list-radio:checked + .param-list-radio-custom{
    border: 1px solid #54D0FF;
    background-color: #fff;
}

.settingsModal #about_me {
    height: 200px;
    padding: 15px;
    overflow: auto;
    padding: 10px 15px;
    line-height: 24px;
}


.datepicker{z-index:9999!important}

.text-aboutme {
    font-size: 16px;
}

.settingsModal .password-details{
    border-radius: 6px;
    border: 1px solid #C6D0D8;
    padding: 30px;
    margin-bottom: 30px;
}

.settingsModal .password-label{
    font-size: 14px;
    margin-bottom: 15px;
}

.settingsModal .password-mark{
    background-color: #EBFAFF
}


.settings-skills-item {    
    /*width: 100%;*/
    margin-bottom: 0px;
    border-top: 1px solid #C6D0D8;
    background-color: #FFF;
    /*border-radius: 6px;    */
    padding: 0;
    font-size: 16px;
    height: 50px;
    position: relative;
    margin-left: -30px;
    margin-right: -30px;
}

.settings-skills-item:last-child {
    border-bottom: 1px solid #C6D0D8;
    margin-bottom: 20px;
}

.settings-skills-item.active {    
    background-color: #F3FCFF;
    height: 110px;
}

.settings-skills-item.active label {
    margin-bottom: 0px;
}

.settings-skills-item .form-control {
    background-color: #fff;
    margin-left: 70px;
    width: auto;
    width: -webkit-fill-available;
    margin-right: 30px;
    display: none;
}

.settings-skills-item.active .form-control {
    display: block;
}


 .settings-skills-item label
 {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    line-height: 47px;
    cursor: pointer;    
    margin-left: 30px;
}


.skills-checkbox-custom {
    width: 25px;
    height: 25px;
    border: 1px solid #C6D0D8;
    border-radius: 3px;
    position: relative;
    float: left;
    margin-top:12px;
    margin-right: 15px;
}
.skills-checkbox:checked + .skills-checkbox-custom::before {
    content: url('../img/check-white1.svg');
    display: block;
    position: absolute;
    top: -13px;
    left: 5px;
}
.skills-checkbox-custom,
.skills-checkbox:checked + .skills-checkbox-custom::before {
    border-radius: 3px;
}

.skills-checkbox:checked + .skills-checkbox-custom{
    border: 1px solid #54D0FF;
    background-color: #54D0FF;
}

.skills-checkbox {
    display: none;
}

body.modal-open {
    /*overflow: visible;
    padding-right: 0 !important;*/
    position: inherit;
}

.add-work, .add-education {
    color: #54D0FF;
    font-size: 16px;
    text-align: left;
    cursor: pointer;
}

.btn-tc-gray {
    background-color: #54D0FF;
    color: #fff;
}
.btn-tc-gray:hover {
    background-color: #00aff1;
    color: #fff;
}

.work-list, .education-list {
    width: 100%;
}
.work-item, .education-item {
    width:100%;
    padding-right: 40px;
}

.work-item hr, .education-item hr {
    margin-right: -25px;
}

.work-delete, .education-delete {
    background: url(../img/cv-del.svg) no-repeat right center;
    right: 20px;
    top: 0px;
    position: absolute;
    padding-left: 0px;
    padding-right: 30px;
    cursor: pointer;
}

.experience-line, .education-line {
    position: absolute;
    border-left:1px solid #E1E9F0; 
    top: 11px;
    margin-left: 7px;
}

.experience-container, .education-container {
    margin-left: 35px;
}

.experience-container div, .education-container div {
    margin-bottom: 20px;    
}

.experience-container div:before, .education-container div:before{ 
    content: " ";
    background: #54D0FF;
    width: 5px;
    height: 5px;
    left: 20px;
    position: absolute;
    border-radius: 5px;
    margin-top: 11px;
}


.fromto {
    font-size: 22px;
    color: #728B9B;
    line-height: 50px;
    text-align: center;
    width: 10px;
}

#price_rate_more_than_4_hours, #price_rate_24_7 {
    padding-left: 25px;
}

.usd:before {
    content: '$';
    left: 30px;
    top: 61px;
    position: absolute;
}


#settingsModal-testimonials .modal-title {
    max-width: 350px;
    line-height: 26px;
}

/*for modal drop-down adrress list*/
.settingsModal.tc-modal { z-index:1000; }
.modal-backdrop {z-index:999}



.param-list-item .select2-container--default .select2-selection--single {
    background-color: #F2F6FB;
    border: none;
    border-radius: 6px;
    height: 48px;
}


.param-list-item .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 48px;
}

.param-list-item .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 48px;
}

.param-list-item .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: none;
    width: 12px;
    height: 7px;
    background-image: url(../img/arrow2.svg);
    margin-left: -20px;
    margin-top: -4px;
}

.param-list-item .select2-container .select2-selection--single .select2-selection__rendered{
    padding-left: 15px;
    padding-right: 35px;
}

.blue-label {
    font-size: 14px;
    background-color: #EEFAFE;
    border-radius: 6px;
    text-align: center;
    padding: 10px;
    width: 100%;
}

#outside_clients {
    width: 100%;
}


.settings-sent-invite{
    background: url('../img/sent.png') no-repeat center center;
    background-size: 100px 77px;
    display: block !important;
    margin: 0 auto !important;
    margin-bottom: 25px !important;
    width: 100px;
    height: 77px;
}

.provider_badge{
    width: 50px;
    height: 50px;
    margin-bottom: 5px;
}

.star {
    display: inline-block;
    margin-right: 5px;
}

.testimonial_user {
    display: inline-block;
    font-weight: bold;
    margin-right: 10px;
}

.testimonial_date{
    display: inline-block;
    color: #869AAA;
}


.btn-load-testimonials {
    background-color: #fff;
    border: 1px solid #C6D0D8;
    color: #869AAA;
    height: 50px;
    cursor: pointer;
    font-size: 16px;
    line-height: 50px;
    padding: 0;
}

.btn-load-testimonials:hover {
    background-color: #fff;
    border: 1px solid #54D0FF;
    color: #54D0FF;
}

.testimonial_external{
    height: 20px;
    border-radius: 3px; 
    background-color: #EFF6FC;
    color:#95A1AA;
    font-size: 11px;
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    line-height: 20px;
}

.testimonial_internal{
    height: 20px;
    border-radius: 3px; 
    background-color: #E9FBF3;
    color:#29C581;
    font-size: 11px;
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    line-height: 20px;
}

.testimonial-item:not(:first-child){
    border-top: 1px #CCD8E2 solid;
    padding-top: 15px;
}

.star_off {
    opacity: 0.3;
}

#provider-rating-value {
    font-size: 14px;
    display: inline-flex;
    vertical-align: bottom;
}

/*for mobile*/
@media (max-width: 700px) {

/*    .provider_badge_title
    {
        font-size: 14px;
    }*/

    .blue-label {
        font-size: 13px;
    }

    #settingsModal-testimonials .param-list-item label {
        font-size: 14px;
    }

    #profile-new-settings-form .cv-button.active { 
        padding-left: 10px;
    }

    .new-settings #profile-settings hr 
    {
        margin-left: -15px;
        margin-right: -15px;
    }

    .ready2move label{
        font-size: 14px;
    }

    .settings-skills-item {    
        /*width: 100%;*/
        margin-bottom: 0px;
        border-top: 1px solid #C6D0D8;
        background-color: #FFF;
        /*border-radius: 6px;    */
        padding: 0;
        font-size: 16px;
        height: 50px;
        position: relative;
        margin-left: -19px;
        margin-right: -19px;
    }

    .settings-skills-item label {
        margin-left: 20px;
    }

    .settings-skills-item .form-control {
        margin-left: 60px;
        margin-right: 20px;
    }

    .settingsModal .modal-dialog
    {
        position: relative;
        width: auto;
        max-width: 360px;
        left: 47.5% !important;
    }

    .settingsModal .modal-content{
        padding: 20px;
    }

    .settingsModal .modal-header{
        height: auto;

    }

    .settingsModal .modal-title {
        display: block;
        max-width: 100%;
        margin-right: 10px;
        
    }

    .settingsModal .modal-title p{
        font-size: 16px;
        line-height: 24px;
    }

    .settingsModal .service-button-containter{
        float:left;
        margin-top: 28px;
        width: 100%;
    }

    .modal-dialog{
        margin:10px;
    }

}
